<template>
	<view>
		<!-- 头部导航 -->
		<view class="tabbbar">
		  <text class="quxiaojiantou"><</text>
		  <text class="tabtext">补卡申请</text>
		</view>
    
    
    <!-- 底部tabbr -->
	
    <!-- 底部tabr -->
     <view class="tabr">
       <li>
         <image src="./img/buka.png" mode=""></image>
         <view>
           首页
         </view>
       </li>
      <li>
        <image src="./img/qingjia.png" mode=""></image>
        <view >
          商城
        </view>
      </li>
    
      
       
     </view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style>
/* tabbar */
.tabbbar {
  width: 100%;
  height: 116rpx;
 background: url(../img/tabbar.png) no-repeat;
 background-size: cover;
  opacity: 0.3;
  

}
.quxiaojiantou {
  font-family: PingFang SC;
  font-weight: bold;
  color: #333333;
      line-height: 114rpx;
      margin-left: 50rpx;
}
.tabtext {
  width: 70rpx;
  height: 34rpx;
  font-size: 36rpx;
  font-family: PingFang SC;
  font-weight: bold;
  color: #333333;
  line-height: 30rpx;

 margin-left: 222rpx;
}
/* 底部tabbr */
.tabr {
  position: fixed;
  bottom: 0px;
 width: 750rpx;
 height: 98rpx;
 background: #FFFFFF;
 box-shadow: 0px 3px 76px 0px rgba(192, 192, 192, 0.33);

}
.tabr {
  display: flex;
  
}
.tabr li {
 padding-top: 12rpx;
  flex: 1;
  text-align: center;
}
.tabr image {
  
  width: 40rpx;
  height: 40rpx;
 
}
.tabr view {
 
  font-size: 22rpx;
  font-family: PingFang SC;
  font-weight: bold;
  color: #777777;
 

}
</style>
